<template>
	<view class="">
		<uni-nav-bar :statusBar="true"  :border="false" title='我的'>
			<view slot="right" class="right">
				<image src="../../../static/set.png" class="" mode=""></image>
			</view>
		</uni-nav-bar>
		<view class="ROW JUSB head CENT">
			
			<view class="CENT">
				<image src="../../../static/head.png"  mode=""></image>
			</view>
			<view class="CENT FLEX_1 JUSB">
				<view class="UPDW CENT" >
					<view class="title1">{{hkcUser.userName}}</view>
					<view class="title2">司机</view>
				</view>
				<view> > </view>
			</view>
			
		</view>
		<view class="ROW  mokuai_row2 JUSB">
			<view class="mokuai2 JUSB">
				<view class="UPDW mokuai2_r JUSB CENT" v-for="(item,index) in list2" :key='index'>
					<view class="CENT title1">
						{{item.number}}
					</view>
					<view class="CENT title2">
						{{item.text}}
					</view>
				</view>
			</view>
		</view>
		<view class="ROW UPDW CENT" >
			<view class=" CENT JUSB LIST" style="width: 100%;">
				<view class="CENT">
					<image class="img" src="../../../static/p1.png" mode=""></image>
				</view>
				<view class="font FLEX_1 JUSB">
					<view>我的设备</view>
					<view>></view>
				</view>
			</view>
			
		</view>
		<view class="ROW UPDW CENT" >
			
			<view class=" CENT JUSB LIST" style="width: 100%;">
				<view class="CENT">
					<image class="img" src="../../../static/p2.png" mode=""></image>
				</view>
				<view class="font FLEX_1 JUSB">
					<view>我的钱包</view>
					<view>></view>
				</view>
			</view>
			
		</view>
		<view class="ROW UPDW CENT" >
			
			
			<view class=" CENT JUSB LIST" style="width: 100%;">
				<view class="CENT">
					<image class="img" src="../../../static/p3.png" mode=""></image>
				</view>
				<view class="font FLEX_1 JUSB">
					<view>我的圈子</view>
					<view>></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// import slFilter from '@/components/sl-filter/sl-filter.vue';
	export default {
		components: {
		    // slFilter
		},
		data() {
			return {
				list:[
					{
						number:3000,
						text:'人员',
						class:'bg1'
					},
					{
						number:3000,
						text:'人员',
						class:'bg2'
					},
					{
						number:3000,
						text:'人员',
						class:'bg3'
					},
					{
						number:3000,
						text:'人员',
						class:'bg4'
					},
					{
						number:3000,
						text:'人员',
						class:'bg5'
					},
					{
						number:3000,
						text:'人员',
						class:'bg6'
					},
					{
						number:3000,
						text:'人员',
						class:'bg7'
					},{
						number:3000,
						text:'人员',
						class:'bg8'
					},
					{
						number:3000,
						text:'人员',
						class:'bg9'
					}
					
					
				],
				list2:[
					{
						number:4320,
						text:'费用(元)'
					},
					{
						number:8,
						text:'物品'
					},
					{
						number:2,
						text:'违规'
					},
					{
						number:2000,
						text:'轨迹'
					},
					{
						number:213,
						text:'工作量'
					},
					{
						number:'',
						text:''
					}
					
					
				],
				hkcUser:{
					"result":null,
					"uid":null,
					"ROLE_ID":null}
				}
		},
		onLoad() {
			let _this = this;
			uni.getStorage({
			    key: 'userInfo',
			    success: function (res) {
			        console.log(res.data);
					_this.hkcUser = res.data;
			    }
			});
		},
		methods: {
			cheack(e){
				console.log(e)
			}
		}
	}
</script>

<style scoped lang="scss">
.right{
	image{
		height: 36rpx;
		width: 36rpx;
	}
}

.title1{
	font-size:28rpx ;
	// color: #454545;
}
.title2{
	font-size:24rpx ;
	color: #a0a0a0;
}
.head{
	width: 100%;
	padding: 32rpx 60rpx;
	box-sizing: border-box;
	image{
		height: 90rpx;
		width: 90rpx;
		border-radius: 45rpx;
		margin-right: 32rpx;
	}
	
}
.mokuai_row2{
	width: 100%;
	padding: 20rpx;
	box-sizing: border-box;
	border-bottom: 1rpx solid #EEEEEE;
	.mokuai2{
		flex-wrap: wrap;
		width: 100%;
	}
	.mokuai2_r{
		height: 75rpx;
		width: 33%;
		margin-bottom: 20rpx;
	}
}
.img{
	height: 30rpx;
	width: 30rpx;
	margin-right: 20rpx;
}
.font{
	font-size: 30rpx;
}
.LIST{
	flex: 1;
	height: 100rpx;
	width: 100%;
	padding: 0 32rpx;
	align-items: center;
	
}
</style>
